import 'package:flutter_menu/res/app_design.dart' hide SearchController;
import 'package:get/get.dart';

import './table_controller.dart';


var _regionTextChecked  = const TextStyle(
color: AppColors.e3a671,
decoration: TextDecoration.underline, // 设置下划线
decorationColor: AppColors.e3a671,
);
var _regionText  = const TextStyle(
  decorationColor: Color(0xFF1E1E1E),
);

class TablePg extends GetView<TableController> {
  @override
  Widget build(BuildContext context) {
    return GetBuilder<TableController>(
        init: controller,
        builder: (controller) =>
            body(context).whitScaffold(backgroundColor: const Color(0xffF8F6E7))).unPop();
  }

  Widget body(BuildContext context) {
    return SafeArea(
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        mainAxisSize: MainAxisSize.max,
        children: [
          _titleBar(),

          Row(
            children: [
              _region().size(width: 223.w),
              _regionDetail().expanded()
            ],
          ).expanded()
        ],
      ).size(width: double.infinity),
    );
  }

  Widget _titleBar() {
    return DefaultTextStyle(
      style: TextStyle(fontSize: AppDimen.sp_28, color: Colors.white),
      child: Container(
        color: AppColors.e3a671,
        height: 76.w,
        padding: EdgeInsets.symmetric(horizontal: 31.w),
        child: Row(
          children: [
            GestureDetector(
                onTap: () {
                  Get.back();
                },
                child: Text("cancel".tr)),
            Text("select_oder_num".tr).center().expanded(),
            GestureDetector(onTap: controller.order, child: Text("table_order".tr)),
          ],
        ),
      ),
    );
  }

  Widget _region() {
    var tables = controller.areas;
    return ListView.builder(
        itemCount: tables.length,
        itemBuilder: (ctx, index) {
          var table = tables[index];
          var style = table == controller.areaSelect ? _regionTextChecked : _regionText;
          return Container(
            constraints: BoxConstraints(
              maxHeight:  84.w
            ),
            child: Text(
              "${table.areaName}",
              style: style,
            ).center(),
          ).onTap((){
            controller.selectArea(index, table);
          });
        });
  }

  Widget _regionDetail(){
    var tables =  controller.areaSelect?.tables;
    if(tables == null) return Container();

    return GridView.builder(
      gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
        crossAxisCount: 2,
        childAspectRatio: 2.47,
      ),
      itemCount: tables.length,
      itemBuilder: (context, index) {
        var table =  tables[index];
        var bgColor = table == controller.tableSelect ? AppColors.e3a671 : Colors.white;
        var txColor = table == controller.tableSelect ? AppColors.white : AppColors.text_4F;
        return Card(
          elevation: 4, // 设置阴影
          color: bgColor,
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(10.w), // 设置圆角
          ),
          child: Padding(
            padding:  EdgeInsets.symmetric(horizontal: 16.w ),
            child: Text(
              '${table.tableName}',
              style: TextStyle(fontSize: AppDimen.sp_22,color:txColor ),
              maxLines: 3,
              overflow: TextOverflow.ellipsis,
            ).center(),
          ),
        ).onTap((){
            controller.onSelectTable( index , table);
        });
      },
    ).marginOnly(top: 16.w);
  }


}
